<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Battle city</title>
    <link rel="stylesheet" type="text/css" href="/css/screen.css">
    <script type="text/javascript" src="/lib/jquery.js"></script>
    <script type="text/javascript" src ="/socket.io/socket.io.js"></script>
    <script type="text/javascript" src="/lib/node/events.js"></script>
    <script type="text/javascript" src="/src/common/func.js"></script>
    <script type="text/javascript" src="/src/common/event.js"></script>
    <script type="text/javascript" src="/src/common/list.js"></script>
    <script type="text/javascript" src="/src/client/widgets.js"></script>
    <script type="text/javascript" src="/src/client/ui-list.js"></script>
    <script type="text/javascript" src="/src/common/map_tiled.js"></script>
    <script type="text/javascript" src="/src/common/premade.js"></script>
    <script type="text/javascript" src="/src/common/message.js"></script>
    <script type="text/javascript" src="/src/common/user.js"></script>
    <script type="text/javascript" src="/src/battle-city/field.js"></script>
    <script type="text/javascript" src="/src/client/field-view.js"></script>
    <script type="text/javascript" src="/src/battle-city/keyboard.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/abstract.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/animation.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/bullet.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/tank.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/tankbot.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/wall.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/delimiter.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/base.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/bonus.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/trees.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/water.js"></script>
    <script type="text/javascript" src="/src/battle-city/objects/ice.js"></script>
    <script type="text/javascript" src="/src/battle-city/client/graphic-loader.js"></script>
    <script type="text/javascript" src="/src/client/bc-client.js"></script>
    <script type="text/javascript" src="/src/client/bc-ui.js"></script>
    <script type="text/javascript" src="/src/init.js"></script>

    <script src="lib/code-mirror/codemirror.js"></script>
    <link  href="lib/code-mirror/codemirror.css" rel="stylesheet">
    <script src="lib/code-mirror/javascript.js"></script>
    <link  href="lib/code-mirror/default.css" rel="stylesheet">
</head>
<body>
<div id="login">
    <form id="login-form" style="display: none;">
        <h4>Прочитайте пожалуйста:</h4>
        <ul class="faq">
            <li>Не верьте всему что пишут в чате, потому-что любой троль может зайти под моим ником.</li>
            <li>Управление: Стрелки - ездить, пробел - стрелять.</li>
            <li>Это просто демка, а не законченный продукт. Поэтому дизайн убогий, баги жирные.</li>
            <li>Максимум может быть только 10 игр одновременно - это
                связанно со скорость моего интернет подключения.</li>
            <li>Конструктивную критику, баги и предложения направлять на vtk666@gmail.com</li>
        </ul>
        <div><span>Введите ник:</span><input type="text" name="nick"></div>
        <div class="submit"><input type="submit" value="Войти"></div>
    </form>
    <div id="message-connecting">Подключение...</div>
    
    <div class="like-wrapper">
        <div id="fb-root"></div>
        <script>(function(d, s, id) {
          var js, fjs = d.getElementsByTagName(s)[0];
          if (d.getElementById(id)) {return;}
          js = d.createElement(s); js.id = id;
          js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
          fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));</script>
        <div class="fb-like" data-href="http://vtk.tom.ru:8124/" data-send="false" data-layout="button_count" data-width="100" data-show-faces="true" data-colorscheme="dark"></div>
    </div>
    
    <div id="credits">
        <a class="span" href="http://www.spriters-resource.com/nes/batcity/sheet/11756">Sprites by Zephiel87</a>
        <a class="span" href="http://code.google.com/p/battle-city-js/">Source code by vtk</a>
        Powered by <a href="http://nodejs.org/">node.js</a> and <a href="http://socket.io/">socket.io</a>
    </div>
</div>

<div id="public" style="display: none;">
    <h1>Общий чат</h1>
    <div class="user-list"><h3>Игроки</h3></div>
    <div class="premades">
        <div>Присоеди&shy;нитесь в идущую игру:</div>
    </div>
    <div class="chat">
        <div class="chat-log">
            <div class="messages"></div>
        </div>
    </div>
    <form class="message-form">
        <input type="text" name="message">
        <input type="submit" value="Отправить">
    </form>
</div>

<div id="create" style="display: none;">
    <h1>Создать игру</h1>
    <h3>Выберите тип игры:</h3>
    <ul class="game-modes">
        <li id="classic" class="current">
            <img src="/img/client/classic.png" width="208" height="208" alt="classic"/>
            <h4>Классический</h4>
            <p>Тут вы можете пройти все 35 уровней старых добрых танчиков. После 
            завершения каждого уровня нажимайте "Старт!", чтобы начать следующий.</p>
        </li>
        <li id="teamvsteam">
            <img src="/img/client/teamvsteam.png" width="208" height="208" alt="teamvsteam"/>
            <h4>Командный</h4>
            <p>В командном режиме вы можете сразиться с другимим игроками 2 на 2.
            Доступен только один уровень. Первые двое подключившихся страртуют снизу карты,
            третий и четвертый - сверху.</p>
        </li>
    </ul>
    <form id="create-form">
    <div>
        Введите имя новый игры:
        <input type="hidden" name="type" value="classic">
        <input type="text" name="name">
        <input type="submit" value="Создать">
    </div>
    </form>
    <div class="create-bot">или<br/><a id="create-bot" href="#">Запрогать бота (pre-alpha) &rarr;</a></div>
</div>

<div id="premade" style="display: none;">
    <h1>Чат игры</h1>
    <div class="user-list"><h3>Игроки</h3></div>
    <div class="game-controls">
        <input class="start-game" type="button" value="Старт!">
        <input class="exit-game" type="button" value="Выйти">
        <div class="level">Уровень: <select name="level"></select></div>
        <div>1: <span class="player0-stats"></span></div>
        <div>2: <span class="player1-stats"></span></div>
        <div>3: <span class="player2-stats"></span></div>
        <div>4: <span class="player3-stats"></span></div>
    </div>
    <div class="chat">
        <div class="chat-log">
            <div class="messages"></div>
        </div>
    </div>
    <form class="message-form">
        <input type="text" name="message">
        <input type="submit" value="Отправить">
    </form>
</div>

<div id="bot-editor" style="display: none;">
    <div id="editor"></div>
    <div class="game-controls">
        <input class="start-game" type="button" value="Старт!">
        <input class="stop-game" type="button" value="Стоп">
        <input class="exit-game" type="button" value="Выйти">
        <div class="level">Уровень: <select name="level"></select></div>
        <div>1: <span class="player0-stats"></span></div>
        <div>2: <span class="player1-stats"></span></div>
        <div>3: <span class="player2-stats"></span></div>
        <div>4: <span class="player3-stats"></span></div>
    </div>
</div>

<div id="game" style="display: none;">
    <div id="bot-stack"></div>
    <canvas id="field" width="416" height="416"></canvas>
    <div id="game-stat">
        <div class="player0-stats"></div>
        <div class="player1-stats"></div>
        <div class="player2-stats"></div>
        <div class="player3-stats"></div>
    </div>
    <div class="fb-like" data-href="http://vtk.tom.ru:8124/" data-send="false" data-layout="button_count" data-width="100" data-show-faces="true" data-colorscheme="dark"></div>
</div>
</body>
</html>